<template>
	<TableNest :config='config' />
</template>

<script setup>
	/* ---------------------------  Component --------------------------- */
	const TableNest 	= $.lazy(()=>import('#cpt/table/table-nest.vue'))
	/* ---------------------------  数据格式 --------------------------- */
	const config = {
		search: {
			data: [
				{ label:'名称', 	name:'name' },
			]
		},
		controls: {
			title: '嵌套表格',
			controls: [],
		},
		table: {
			data : [
				{ name:'Vue', con:'1', num: 10, mark:'备注', id:1, 
					children:[
						{ name:'Vue', con:'1', num: 10, mark:'备注', id:2 },
						{ name:'Vue', con:'1', num: 10, mark:'备注', id:3 },
					]
				},
				{ name:'Vue', con:'1', num: 10, mark:'备注', id:2 },
				{ name:'Vue', con:'1', num: 10, mark:'备注', id:3 },
				{ name:'Vue', con:'1', num: 10, mark:'备注', id:4 },
			],
			cols: [
				{ title: '名称', 	dataIndex: 'name' },
				{ title: '数量', 	dataIndex: 'num' },
			],
			controls 	: {
				data: () => [
					{ mode:'delPop', api:'/del', abs:1 }
				]
			},
		},
		tableChild: {
			childApi : '/list',
			cols: [
				{ title: '名称', 	dataIndex: 'name' },
				{ title: '数量', 	dataIndex: 'num' },
				{ title: '数量', 	dataIndex: 'mark' },
			],
			controls 	: {
				data: () => [
					{ mode:'delPop', api:'/del', abs:1 }
				]
			}
		}
	}
</script>